<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../util/bootstrap-3.3.7-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../css/department.css">
    <script src="../util/jquery-3.3.1.js"></script>

    <script src="../util/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
    <script src="../js/department.js" defer></script>
</head>
<body >
<div id="zl-d5">
    <ul>
        <li>部门名称：教务部</li>
        <li>部门负责人：基兰</li>
        <li>部门联系电话：083655555</li>
        <li><button id="btn2">退出</button></li>
    </ul>

</div>
<div id="zl-d6">
    <ul>
        <li>部门名称: <input type="text"> </li>
        <li>部门负责人: <input type="text"></li>
        <li>部门联系电话: <input type="text"></li>
        <li><button id="btn3">退出</button></li>
        <li><button id="btn4">保存</button></li>
    </ul>

</div>
<div class="container">

    <div class="col-lg-12 col-md-12 col-sm-12" id="zl-d1">
        <p>欢迎管理员：啦啦!</p>
        <p>当前时间为：</p>
        <span class="time"> </span>
        <input type="text" placeholder="搜索部门">
        <span class="glyphicon glyphicon-search span1"></span>
    </div>
    <p id="zl-d2"><strong>国信安国际幼儿园部门管理信息</strong></p>
    <div  id="zl-d4">
        <table  id="zl-tb" class="table table-condensed">
            <tr class="active" id="tr1">
                <th>部门</th> <th class="th5">负责人</th><th class="th6">联系电话</th><th></th>

               <div id="zl-d3"><button  type="button" id="zl-btn"  class="btn btn-success">全选</button>
           <button type="button" id="zl-btn1" class="btn btn-primary" data-toggle="modal" data-target="#jj">添加</button>
                 <button type="button" id="zl-btn2" class="btn btn-danger">删除</button></div>
                <th></th>
            </tr>
            <tr class="tr1" > <td>教务部</td> <td class="td3">基兰</td><td  class="td4">083655555</td>  <td class="td2">部门详情</td> <td><input  class="ipt1" type="checkbox"></td>
                <td class="td1">
                <button  class="btn btn-default btn-xs btn1" data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                <button class="btn btn-default btn-xs btn2" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                <button class="btn btn-default btn-xs  remove" data-aaa="A"> <span  class="glyphicon glyphicon-remove-sign remove" aria-hidden="true"></span>删除</button>
            </td>
            </tr>
            <tr class="tr1"> <td>宣传部</td> <td class="td3">盖伦</td><td  class="td4">083655555</td><td  class="td2">部门详情</td> <td><input class="ipt1" type="checkbox"></td>
                <td class="td1">
                    <button class="btn btn-default btn-xs btn1" data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                    <button  class="btn btn-default btn-xs btn2" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                    <button class="btn btn-default btn-xs  remove" data-aaa="A"> <span class="glyphicon glyphicon-remove-sign" aria-hidden="true"></span>删除</button>
                </td></tr>
            <tr class="tr1" > <td>财务部</td> <td class="td3">菲奥</td><td  class="td4">083655555</td> <td  class="td2">部门详情</td> <td ><input class="ipt1" type="checkbox"></td>
                <td class="td1">
                    <button class="btn btn-default btn-xs btn1"  data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                    <button class="btn btn-default btn-xs btn2" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                    <button class="btn btn-default btn-xs remove" data-aaa="A"> <span class="glyphicon glyphicon-remove-sign " aria-hidden="true"></span>删除</button>
                </td>
            </tr>
            <tr class="tr1">  <td>后勤部</td> <td class="td3">黑墨</td><td  class="td4">083655555</td> <td  class="td2">部门详情</td>  <td><input class="ipt1" type="checkbox" ></td>
                <td class="td1">
                <button class="btn btn-default btn-xs btn1"  data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                <button class="btn btn-default btn-xs btn2" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                <button class="btn btn-default btn-xs remove" data-aaa="A"> <span class="glyphicon glyphicon-remove-sign " aria-hidden="true"></span>删除</button>
            </td></tr>
            <tr class="tr1"> <td>保卫部</td> <td class="td3">杰斯 </td><td  class="td4">083655555</td> <td  class="td2">部门详情</td>
                <td><input class="ipt1" type="checkbox"></td>
                <td class="td1">
                <button class="btn btn-default btn-xs btn1"  data-aaa="A"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span>详情</button>
                <button class="btn btn-default btn-xs btn2" data-aaa="A"> <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>编辑</button>
                <button class="btn btn-default btn-xs remove" data-aaa="A"> <span class="glyphicon glyphicon-remove-sign " aria-hidden="true"></span>删除</button>
            </td></tr>
        </table>
    </div>
    <nav   aria-label="Page navigation">
        <ul class="pagination">
            <li>
                <a href="#" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li>
                <a href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        </ul>
    </nav>
</div>

<!-- Button trigger modal -->


<div class="modal fade"  id="jj" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">添加部门</h4>
            </div>
            <div class="modal-body">
             <span>部门名称</span> <input id="zl-inp" type="text"><br>
                <span>部门负责人</span>&nbsp&nbsp&nbsp&nbsp&nbsp<input  id="zl-inp1"type="text"><br>
                <span>联系人电话</span>
                <input  id="zl-inp2"type="text"><br>
                <span>部门详情</span>
                <input  id="zl-inp3" type="text">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" id="zl-btn3" class="btn btn-primary" data-dismiss="modal">保存</button>
            </div>
        </div>
    </div>
</div>
</div>
</body>
</html>